<template>
  <div class="turnTable">
    <infoText ref="infoText"></infoText>
    <img class="img1" src="./img1/bg.png" alt="" />
    <div id="stage"></div>
  </div>
</template>

<script>
import TurnGame from './game'
import $util from '../../utils'

export default {
  data() {
    return {
      door1: true,
      prizeNo: 0,
    }
  },
  mounted() {
    uni.setNavigationBarTitle({
      title: '幸运大转盘',
    })
    let obj = {
      prizeList: [
        {
          name: '一等奖',
          img: require('./img1/11.png'),
        },
        {
          name: '二等奖',
          img: require('./img1/12.png'),
        },
        {
          name: '三等奖',
          img: require('./img1/13.png'),
        },
        {
          name: '四等奖',
          img: require('./img1/14.png'),
        },
        {
          name: '五等奖',
          img: require('./img1/15.png'),
        },
        {
          name: '谢谢参与',
          img: require('./img1/10.png'),
        },
      ],
      prizeNo: 1,
      width: 300,
      height: 300,
      el: document.querySelector('#stage'),
      vue: this,
    }

    let game = null
    try {
      let fix1 = decodeURI(location.search)
        .split('#')[0]
        .split('?')[1]
      let qData = $util.StrQuery(fix1, 'qd')
      if (qData) {
        let obj1 = JSON.parse(qData)
        Object.assign(obj, obj1)
        this.prizeNo = obj.prizeNo
      }
    } catch (error) {}

    function reLoad() {
      if (game) {
        game.stop()
      }
      game = null
      game = new TurnGame(obj)
      game.init()
    }

    reLoad()
  },
}
</script>

<style scoped>
.turnTable {
  position: relative;
}
.img1 {
  width: 100%;
}
#stage {
  position: absolute;
  top: 220rpx;
  left: 50%;
  transform: translateX(-50%);
}
</style>
